<template>
  <div class="card">
    <h2>商品信息</h2>
    <p>商品id: {{ goodInfo.goodNo }}</p>
    <p>商品名称: {{ goodInfo.goodName }}</p>
    <div>商品描述: <GoodDesp :imgUrl="goodInfo.desc"></GoodDesp>
    </div>
  </div>
</template>

<script>
import GoodDesp from './GoodDesp'
export default {
  props: [
    'goodInfo'
  ],
  components: {
    GoodDesp
  }
}
</script>

<style scoped>
.card {
  background-color: #fff;
  padding: 20px;
  border-radius: 8px;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
  margin-bottom: 20px;
}

.card h2 {
  color: #007bff;
  font-size: 18px;
  margin-top: 0;
}

.card p {
  margin: 10px 0;
}

.card>div {
  display: flex;
}
</style>